<template>
  <fieldset>
    <legend>App</legend>
    <div class="box">
      <headText></headText>
      <bodyText></bodyText>
      <listText></listText>
      <bottomText></bottomText>
    </div>
  </fieldset>
</template>

<script setup>
  import headText from "./components/headText.vue"
  import bodyText from "./components/bodyText.vue"
  import listText from "./components/listText.vue"
  import bottomText from "./components/bottomText.vue"

  // console.log(arr);
</script>

<style>
#app {
  margin: 200px auto;
  width: 500px;
  
}
body{
  background-color: aqua;
}
.box{
  display: flex;
  flex-direction: column;
  width: 440px;
  background-color: white;
  padding: 30px 40px 20px;
  border-radius: 15px;
}
</style>